*{margin: 0;padding: 0;list-style: none;text-decoration: none;}
html,body{height: 100%;background: #F6F6F6;}
/*顶部广告*/
.topAdvertising{
    width: 1200px;height: 90px;margin: 0 auto;position: relative;
    img{width: 1200px;height: 90px;}
    .topFork{width: 30px;height: 30px;background-color: #C2646D;position: absolute;top: 0;right: 0;text-align: center;line-height: 25px;font-size: 40px;color: white;cursor: default;}
    }
/*导航*/
nav{
    width: 100%;
    .navTop{
        height: 30px;background-color: #E2E3E4;line-height: 30px;text-align: center;
        .navTopLeft{
            width: 252px;height: 30px;margin-left: 83px;float: left;
            li{
                width: 84px;float: left;font-size: 12px;a:hover{color: #FF7600;}
                span{color: black;}
                i{color: #666666;text-align: end;font-size: 6px;}
                }
            }
        h4{width: 160px;float: left;margin-left: 247px;}
        .navTopRight{
            width: 600px;height: 30px;float: right;
            li{
                width: 67px;float: left;font-size: 12px;a:hover{color: #FF7600;}
                a{color: black;}
                }
            }
        }
    .navMiddle{
        height: 115px;text-align: center;line-height: 115px;background: white;
        .navMiddleLeft{
            float: left;margin-left: 83px;
            img{width: 200px;height: 75px;margin-top: 20px;}
            }
        .navMiddleRight{
            width: 820px;float: right;margin-right: 83px;height: 115px;position: relative;
            .cont{
                float: left;width: 480px;height: 38px;margin-top: 38px;border:2px solid #FF7600;position: relative;
                input{display:block;width: 423px;height: 38px;position: absolute;outline: none;border: none;color: #CCCCCC;}
                .source{
                    width: 60px;height: 38px;background: #FF7600;float: right;position: relative;cursor: pointer;
                    i{position: absolute;left: 15px;top: -36px;color: white;font-size: 30px;}
                    }
            }
            ul{
                    width: 420px;height: 30px;position: absolute;left: 2px;top: 80px;
                    li{
                        width: 57px;height: 30px;float: left;line-height: 25px;
                        &:nth-child(5){width: 75px;a{color: blue;}}
                        &:first-child{a{color: red;}}
                        &:nth-child(2){a{color: blue;}}
                        &:nth-child(3){a{color: #CCCCCC;}}
                        &:nth-child(4){a{color: red;}}
                        &:nth-child(6){a{color: blue;}}
                        &:last-child{a{color: red;}}
                        a{font-size: 12px;}
                        }
                    }
            .car{
                    width: 122px;height: 40px;line-height: 40px;background: #f8f8f8;float: right;margin: 38px 60px 38px 0;cursor: pointer;
                    i{color: #FF7600;}
                    }
        }
        }
    .navBottom{
        height: 36px;border-bottom: 2px solid #FF7600;background: white;
        .navBottomLeft{
            width: 180px;height: 36px;margin-left: -180px;float: left;background: #FF7600;line-height: 36px;text-align: center;
            i{color: white;font-size: 30px;}
            span{display: block;font-size: 18px;color: white;margin-right: 18px;float: right;}
            }
        ul{
            width: 1020px;float: right;text-align: center;line-height: 36px;
            li{
                float: left;width: 108px;font-size: 15px;
                &:nth-child(7){width: 200px;}
                &:first-child{a{color: #FF7600;}}
                }
            a{color: black;&:hover{color: #FF7600;}}
            }
        }
    }
//二级菜单+轮播页面
.banner{
    width: 1200px;height: 478px;margin: 0 auto;margin-top: 10px;display: flex;
    .left{
        width: 180px;margin-right: 10px;background: white;cursor: pointer;
        .ulLeft{
            width: 142px;height: 216px;margin: 0 auto;
            ul{height: 20px;padding: 5px 0;text-align: center;line-height: 20px;a:hover{color: #FF7600;}}
            li{
                width: 46px;border-right: 2px solid #666666;float: left;
                &:last-child{border-right: none;}
            }
            a{color: black;font-size: 15px;}
        }
    }
    .middle{
        width: 800px;margin-right: 10px;
        .box{
            width: 800px;height: 345px;margin: 0 auto;position: relative;overflow: hidden;
            
        .imgbox a{width: 800px;height: 345px;position: absolute;left:800px;top:0;}
        .imgbox a:nth-child(1){left:0;}
        .imgbox img{width: 800px;height: 345px;}
        .list{
            width: 800px;height: 30px;position: absolute;left: 0;bottom: 0;display: flex;background: rgba(200,200,200,0.5);
            span{flex: 1;line-height: 30px;text-align: center;border-left:1px solid #CCCCCC;border-right: 1px solid #CCCCCC;color: #CCCCCC;}
            span.active{background: #FF7600;color: #CCCCCC;}
            }
        }
        .bottom{
            height: 123px;border-top: 10px solid #F6F6F6;display: flex;justify-content: space-around;background: white;
            img{width: 192px;height: 123px;}
            h4{width: 128px;margin-top: -110px;margin-left: 10px;a{color: white;}}
            p{font-size: 14px;margin-top: 12px;margin-left: 10px;width: 119px;a{color: white;}}
        }
    }
    .right{
        width: 200px;background: white;
        .top{
            height: 147px;border-bottom: 1px solid #CCCCCC;
            img{display: block;width: 63px;height: 63px;margin: 0 auto;}
            p{color: #FF7600;font-size: 14px;text-align: center;margin: 10px 0;}
            .box{
                width: 150px;height: 20px;margin: 0 auto;display: flex;justify-content: space-between;text-align: center;line-height: 17px;
                .left,.right{width: 70px;border: 1px solid #FF3B45;border-radius: 10px;background-color: #FF3B45;a{color: white;font-size: 13px;}}
                }
        }
        .middle{
            height: 184px;width: 200px;border-bottom: 1px solid #CCCCCC;
            h4{display: inline;}
            span{font-size: 14px;float: right;}
            ul{
                margin-top: 12px;font-size: 12px;
                li{width: 200px;height: 18px;margin: 3px 0;a{color: #666666;&:hover{color: #FF7600;}}}
                }
        }
        .bottom{
            height: 147px;display: flex;flex-wrap: wrap;
            .box{
                width: 65px;border-right: 1px solid #ccc;border-bottom: 1px solid #ccc;
                &:nth-child(3){border-right: none;}
                &:nth-child(4){border-bottom: none;}
                &:nth-child(5){border-bottom: none;}
                &:last-child{border-right: none;border-bottom: none;}
                }
            img{display: block;margin: 8px auto;}
            p{font-size: 14px;text-align: center;cursor: pointer;}
        }
    }
}
//限时抢购
.container{
    width: 1200px;margin: 0 auto;a{color: #666666;}
    .limited{
        width: 1200px;height: 352px;margin: 0 auto;margin-top: 10px;background: white;
        h3{color: red;height: 62px;line-height: 62px;i{font-size: 18px;}}
        .limimg{
            width: 1200px;height: 288px;display: flex;justify-content: space-around;
            .limimgbox{
                width: 190px;border: 1px solid #CCCCCC;position: relative;
                &:last-child{border: none;}
                img{
                    display:block;width: 180px;height: 180px;margin: 0 auto;
                    &:last-child{width: 180px;height: 288px;}
                    }
                p{font-size: 14px;margin: 10px;}
                .limMoney{
                    width: 168px;height: 26px;position: absolute;left: 10px;bottom: 10px;border: 1px solid #FF7600;
                    .left{float: left;width: 84px;background: #FF7600;line-height: 26px;text-align: center;span{color: white;}}
                    .right{float: right;width: 84px;line-height: 26px;text-align: center;a{color: black;}}
                    }
                }
        }
    }
    //亲子阅读      //校园阅读      //文学/生活/旅游/时尚/家庭/外语         //财经/新闻/科普/汽车/IT/设计
    .childRead,.schoolRead,.literatureRead,.financeRead{
        width: 1200px;height: 352px;margin: 0 auto;margin-top: 10px;background: white;
        h3{color: black;height: 62px;line-height: 62px;i{font-size: 18px;color: #FF7600;}}
        .childimg{
            width: 1200px;height: 288px;display: flex;justify-content: space-around;
            .childimgbox{
                width: 190px;border: 1px solid #CCCCCC;position: relative;
                &:first-child{
                    border: none;width: 390px;
                    img{width: 390px;height: 288px;}
                    }
                img{
                    display:block;width: 180px;height: 180px;margin: 0 auto;
                    
                    }
                p{font-size: 14px;margin: 10px;}
                .childMoney{
                    width: 168px;height: 26px;position: absolute;left: 10px;bottom: 10px;border: 1px solid #FF7600;
                    .left{float: left;width: 84px;background: #FF7600;line-height: 26px;text-align: center;span{color: white;}}
                    .right{float: right;width: 84px;line-height: 26px;text-align: center;a{color: black;}}
                    }
                }
        }
    }
}
//楼层效果
#floor{
    position: fixed;right: 0;top: 230px;width: 60px;height: 245px;
    li{
        height: 40px;width: 60px;background: #FF7783;border-bottom: 1px solid white;text-align: center;line-height: 40px;color: white;font-size: 14px;cursor: pointer;
        }
}



//主页面底部
.foot{
    width: 1200px;height: 430px;margin: 0 auto;margin-top: 50px;
    .line{width: 100px;height: 20px;margin: 0 auto;text-align: center;line-height: 20px;color: #CCCCCC;}
    .aul{
          margin-top:15px;height: 430px;
          .aulTop{
              height: 110px;display: flex;justify-content: space-around;
              .box{
                  width: 200px;
                  img{display: block;margin: 0 auto;width: 50px;}
                  h4{margin: 0 60px;}
                  p{font-size: 14px;color: #666;margin: 0 32px;}
                  }
              }
          .aulBottom{
              height: 300px;
              dl{
                  width: 200px;float: left;
                  dt{height: 42px;text-align: center;a{color: black;}}
                  dd{height: 40px;text-align: center;a{color: #666666;font-size: 14px;}}
                  }
              }
    }
}
.footul{
        width: 100%;background: white;height: 20px;margin-top: 10px;
    ul{
        margin: 0 50px;
        li{float:left;width: 119px;height: 20px;text-align: center;line-height: 20px;border-right: 1px solid #CCCCCC;
        a{font-size: 12px;color: #666666;}
        &:last-child{border-right: none;}
        }
     }
}

//二级菜单
.twoLevelMenu{
    .menu{
        width: 500px;position: absolute;left: 250px;top: 282px;background: white;display: none;
        .childMenu{
            width: 500px;height: 50px;margin: 10px 0;
            p{display: inline;font-size: 14px;font-weight: 600;a{color: black};a:hover{color: #FF7600;}}
            span{@extend p;font-weight: 500;}
        }
    }
}

//顶部搜索框的显示框
.sourceBox{
    width: 480px;position: absolute;top: 200px;left: 445px;cursor: pointer;background-color: white;display: none;
    p{font-size: 12px;color: #CCCCCC;margin: 10px 7px;}
    .basket{
        @extend p;
        height: 18px;float: left;padding: 0 8px;line-height: 18px;text-align: center;
        }
}
